<script setup lang="ts">
import { ref } from "vue";
//import { useMetaStateRowHook } from "@/store/modules/metaTable";
import Refresh from "@iconify-icons/ep/refresh";
//import { useRouter } from "vue-router";
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
import { saveTableJson, getFormById } from "@/api/metaTable";
import { message } from "@/utils/message";

//const store = useMetaStateRowHook();
//const router = useRouter();
const makingform = ref();
import { FormProps } from "../utils/types";
const props = withDefaults(defineProps<FormProps>(), {
  formInline: () => ({
    id: 0,
    higherDeptOptions: [],
    tableType: 1,
    classID: 0,
    tableName: "",
    tableJson: "",
    status: 1,
    addUser: 0,
    title: "",
    tableIsFaBu: 0,
    addTime: "2022-03-15"
  })
});

const oneRowData = ref(props.formInline);

const handleFormReady = async () => {
  const Result = await getFormById({ id: oneRowData.value.id });
  if (Result.isSuccess) {
    if (Result.result.tableJson != "") {
      makingform.value.setJSON(JSON.parse(Result.result.tableJson));
    }
  } else {
    message(Result.msg, { type: "error" });
  }
};

/*
const resetForm = () => {
  //router.push("metaTableInfo");
};
*/

const saveJson = async () => {
  const Json = JSON.stringify(makingform.value.getJSON());
  //console.log(Json, "-------------", oneRowData.value.id);
  const Result = await saveTableJson({
    id: oneRowData.value.id,
    tableJson: Json
  });
  if (Result.isSuccess) {
    oneRowData.value.tableIsFaBu = 0;
    message("保存成功！", { type: "success" });
  } else {
    message(Result.msg, { type: "error" });
  }
  //console.log(oneRowData.value.tableName, "--", oneRowData.value.id);
};
</script>

<template>
  <!--
  <div class="w-[calc(100%-10px)]">
    <el-form :inline="true" class="search-form bg-bg_color w-[99/100] pl-8 pt-[12px]">
      <el-form-item label="源表编号：" prop="id">
        <el-input placeholder="请输入源表名称" clearable class="!w-[80px]" v-model="store.getID" />
      </el-form-item>
      <el-form-item label="源表名称：" prop="tableName">
        <el-input placeholder="请输入源表名称" clearable class="!w-[200px]" v-model="store.getTableName" />
      </el-form-item>
      <el-form-item>
        <el-button :icon="useRenderIcon(Refresh)" @click="resetForm()" type="primary">
          返回
        </el-button>
      </el-form-item>
    </el-form>
  </div>
-->

  <fm-making-form
    ref="makingform"
    style="height: 650px"
    preview
    generate-code
    generate-json
    clearable
    @ready="handleFormReady"
  >
    <template #action>
      <el-button :icon="useRenderIcon(Refresh)" @click="saveJson()">
        保存
      </el-button>
    </template>
  </fm-making-form>
</template>
